<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<style>
    input:invalid {
        background-color: #ffdddd;
    }

    form:invalid {
        border: 5px solid #ffdddd;
    }

    input:valid {
        background-color: #ddffdd;
    }

    form:valid {
        border: 5px solid #ddffdd;
    }

    input:required {
        border-color: #800000;
        border-width: 3px;
    }

    input:required:invalid {
        border-color: #C00000;
    }

</style>
<body>
<form>
  <label for="url_input">Enter a URL:</label>
  <input type="url" id="url_input" />
  <br />
  <br />
  <label for="email_input">Enter an email address:</label>
  <input type="email" id="email_input" required/>
</form>
</body>
</html>
